Page Patterns.
Canonical layouts assembled from the component library. List, detail, dashboard, and form templates.
01
Page Patterns
Canonical layouts assembled from the components above
List page
Header + filter row + table toolbar + sortable outline table + right-aligned pagination. Default density: 25 rows.
AUTOMATIONS
addNEW AUTOMATION
search
keyboard_arrow_down
keyboard_arrow_down
| ID | Type | Name | Actions ↓ | Frequency | Run at | Last run | Labels | State |
|---|---|---|---|---|---|---|---|---|
| 101289 | code | Tier by Label - O&O | 1,002 | Hourly | :04 | 2025/08/30 03:58 | tiering | task_alt |
| 621684 | Daily Programmatic Digest | 600 | Daily | 11:13 | 2025/07/17 14:47 | task_alt | ||
| 677795 | leaderboard | BlockList_MGNI not billable_Remove | 158 | Daily | 10:18 | 2025/09/05 06:15 | blocklist | task_alt |
| 595206 | leaderboard | BlockList_MGNI not billable_Add | 128 | Daily | 12:32 | 2025/04/15 03:09 | blocklist | task_alt |
| 773069 | add | (Homescreen) Traffic: New Campaign Build | 51 | Hourly | :00, :15, :30, :45 | 2025/08/03 01:33 | task_alt |
Rows per page:25 keyboard_arrow_down
1–25 of 311
List page · tabbed
Same chrome as the basic list, but the body card opens with a tab bar that switches the table beneath it. Search spans the row beneath the tabs.
AGENTIC BUYS
addNEW PROPOSAL
search
| ID | Name | Total budget ↓ | Packages | Created at | Updated at | Status |
|---|---|---|---|---|---|---|
| 126152 | unapproved_proposal_name | $22,100 | 1 | 2025/01/24 17:35 | 2026/02/13 04:11 | task_alt |
| 518183 | proposal_name | $187,900 | 1 | 2025/08/27 07:41 | 2025/02/01 17:04 | task_alt |
| 168954 | proposal_name | $431,500 | 1 | 2025/04/28 22:13 | 2026/03/13 13:12 | task_alt |
| 196497 | proposal_name | $292,200 | 1 | 2025/11/29 19:31 | 2025/03/05 17:07 | task_alt |
| 998076 | rejected_proposal_name | $418,800 | 1 | 2025/02/08 10:45 | 2025/06/07 19:10 | remove_circle_outline |
Rows per page:25 keyboard_arrow_down
1–25 of 311
Detail page · two-column form
Breadcrumb above the page title · tabs · two-column body of column_sections + elevation cards · destructive action bottom-left, cancel + save bottom-right.
automation_name
Basic Info
keyboard_arrow_downStatus
Smart QPS
Scheduling
keyboard_arrow_downFrequency
deleteDELETE
closeCANCEL
saveSAVE & EXIT
Automation detail · split panel
Collapsible chart up top, then executions table on the left and a sticky run/results panel on the right with metric cards and an actions table.
auto-pause-low-fill
Actions (Comparison)
Actions (Today)
Actions (Yesterday)
Actions (Seven Days Ago)
keyboard_arrow_down
12am2am4am6am8am10am12pm2pm4pm6pm8pm10pm
Date range filter
EXECUTIONS
play_arrowRUN AUTOMATION
STATSLOGSERRORSRAW
downloadACTIONS
Ask in Agentic Coder…
142
36
4
ACTIONS
Beacon · object list
Object-type header (icon + title) · sort + search + status icon button-group · stack of list-cards. Each card opens with a colored ID badge whose state hue and status icon match the row's lifecycle (success / pending / rejected).
PROPOSALS
search
ALL
task_alt
task_alt
remove_circle
task_alt235403
proposal nameBuyer name
$10,0000 Total Budget$50 CPM
task_alt740078
proposal nameBuyer name
$10,0000 Total Budget$50 CPM
task_alt215445
pending proposal nameBuyer name
$10,0000 Total Budgetacross 3 product(s)
more_vert
remove_circle512688
proposal nameBuyer name
$10,0000 Total Budget$12 CPM
Beacon · focus object
CANVAS / FOCUS / SANDBOX mode tabs · header row with back arrow, ID pill, status icon, title, and a primary split-button action · stacked attribute cards (Basic Information, Packages, Platform Objects). Package rows use a denser line summary that expands inline into the full targeting + creative table.
CANVAS
FOCUS
SANDBOX
push_pin
public
304hn4
PENDING PROPOSAL NAME
task_altAPPROVE
keyboard_arrow_down
Basic Information
keyboard_arrow_downcontent_copyproduct_idcontent_copyproduct_id_2content_copyproduct
Packages
product namedescription text…
keyboard_arrow_down
product name
keyboard_arrow_up
full description text that could be a lot of lines
my_locationTargeting
| ATTRIBUTE | TARGET |
|---|---|
| Countries | check California |
| Metros | ⊘ Los Angeles Metro, San Francisco-San Jose |
| Frequency Cap | monitor_heart 1 impression / 1 minute |
play_arrowCreative Assigments
| CREATIVE NAME | WEIGHT | DURATION | PREVIEW | ACTION |
|---|---|---|---|---|
| code vast creative name | 1 | 30s | play_arrow | task_altkeyboard_arrow_down |
| videocam video creative name | 1 | 30s | play_arrow | task_altkeyboard_arrow_down |
Platform Objects
| OBJECT TYPE | EXTERNAL ID | OBJECT NAME | CREATED ON |
|---|---|---|---|
 Campaign | 123 | campaign_name | 2026/05/12 09:14 |
| Demand Tag | 32456 | demand_tag_name | 2026/05/12 09:27 |
| Creative | 38741 | creative_name | 2026/05/12 09:42 |
Beacon · attribute editor
Same header chrome as the focus object (back · ID · status · title · split-button save), but the body is a tall stack of collapsible attribute cards built entirely from inset fields, chip groups, and an indented metadata tree of "+ add…" links for nested config (Supply Tags / Audience Targeting / Geographical Targeting).
304hn4
GUARANTEED PRODUCT NAME
saveSAVE
keyboard_arrow_down
Basic Information
keyboard_arrow_downcontent_copytag cancelcontent_copytagoo cancelcontent_copytagalong cancel
content_copy$20 CPM cancelcontent_copy£15 CPM cancelcontent_copy18€ CPM cancel
codevideo_vast cancelvideocamvideo_ctv_midroll_30s cancel
Ad Server Metadata
keyboard_arrow_downSupply Labels
173: supply label name cancel
Segments